<template>
	<view class="content">
		<!-- <view>
			养犬人姓名（单位名称）
			<text class="huang">※</text>
		</view>
		<input type="text" v-model="name" placeholder="请输入养犬人姓名" /> -->
		<view>
			身份证号（法人身份证号）
			<text class="huang">※</text>
		</view>
		<input type="text" v-model="idCard" placeholder="请输入身份证号" />
		<view @tap="go" class="btn"><button type="default" style="background-color:#fcd700;">查询</button></view>
		<view class="tip" v-if="Data">
			<view>
				<text class="text">犬主姓名:</text>
				{{ Data.userName }}
			</view>
			<view>
				<text class="text">是否符合条件:</text>
				{{ Data.examine }}
			</view>

			<view>
				<text class="text">原因:</text>
				{{ Data.shyj }}
			</view>

			<button @tap="guan" type="primary" style="background-color:#fcd700;padding: 0 60upx;">前往年检</button>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	import CHONG from '../../static/js/function.js';
	export default {
		computed: mapState(['URL']),
		data() {
			return {
				name: '',
				idCard: '',
				Data: '',
			};
		},
		methods: {
			go() {
				console.log(this.URL);
				let idcardReg =
					/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;

				// if (!this.name) {
				// 	CHONG.tip('请填写养犬人姓名', 1);
				// 	return;
				// } else 
				if (!this.idCard) {
					CHONG.tip('请填写身份证号', 1);
					return;
				} else if (!idcardReg.test(this.idCard)) {
					CHONG.tip('请填写正确格式的身份证号', 1);
					return;
				}
				CHONG.tip('查询中', 0);
				let data = {
					// name: this.name,
					idCard: this.idCard
					// "name": "养犬人姓名",
					// "idCard": "身份证号"
				};

				uni.request({
					url: this.URL + 'applying',
					data: data,
					success: res => {
						if (!res.data.success) {
							CHONG.tip(res.data.msg);
						}
						let json = res.data.data[0];
						if (!json.status) {
							CHONG.tip(json.msg);
							return;
						}
						console.log("审核信息");
						console.log(json);
						this.Data = json;
						uni.hideLoading();
					},
					fail: res => {
						console.log(res);
					}
				});
			},
			guan() {
				this.Data = null;
				this.name = '';
				this.idCard = '';
			}
		}
	};
</script>

<style lang="scss">
	.content {
		font-size: 26upx;
		padding: 20upx;

		input {
			color: $chong-text-color;
			font-size: 24upx;
			margin: 10upx 0;
			padding: 4upx 20upx;

			border: {
				radius: 10upx;
				style: solid;
				width: 1upx;
				color: rgba($chong-text-color, 0.2);
			}

			background: white;
		}

		.btn {
			padding: 50upx 0;
			margin: 0 140upx;
		}

		.huang {
			color: $chong-iconbg-color;
		}

		.tip {
			width: 690upx;
			height: 500upx;
			position: relative;
			top: -200upx;
			background: white;
			text-align: center;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			margin: 20upx;
			box-shadow: 0px 6px 5px 0px #d1d1d1;
			font-size: 36upx;
			border-radius: 20upx;

			.text {
				color: #888;
				padding-right: 10upx;
			}
		}
	}
</style>
